<template>
  <div class="com-admin-auth-role">
    <a-button type="primary" size="small" @click="show(null)">
      添加
    </a-button>
    <w-modal
      ref="WModal"
      :title="roleModel ? '修改角色' : '添加角色'"
      :span="[3]"
      :success-func="successFunc"
    >
      <template v-slot:default>
        <a-form-item label="角色名称">
          <a-input
            v-decorator="['name', { rules: [{ required: true, message: '请输入' }], initialValue: roleModel ? roleModel.name : '' }]"
            type="text"
            placeholder="角色名称"
          />
        </a-form-item>
        <a-form-item label="角色说明">
          <a-input
            v-decorator="['describe', { rules: [{ required: true, message: '请输入' }], initialValue: roleModel ? roleModel.describe : '' }]"
            type="textarea"
            placeholder="角色说明"
          />
        </a-form-item>
      </template>
    </w-modal>
  </div>
</template>

<script lang="ts">
import { Admin } from '@/config/api'
import WModal, { ModalFormComType } from '@/components/global/modal/form'
import { Vue, Component } from 'vue-property-decorator'

@Component({
  name: 'ComAdminAuthRoleAdd',
  components: {
    WModal
  }
})
export default class Com extends Vue {
  roleModel: any = null;

  /**
   * 显示
   */
  show (model?: any) {
    this.roleModel = model || null;
    (this.$refs.WModal as ModalFormComType).show()
  }

  /**
   * 确定按钮点击
   */
  async successFunc (values: any) {
    const method = this.roleModel ? '$put' : '$post'
    const url = this.roleModel
      ? `${Admin.auth.role.update}${this.roleModel._id}`
      : Admin.auth.role.create
    await this.$wAxios[method](url, {
      ...values
    })
    this.$message.success('修改成功')
    this.$emit('reload')
  }
}
</script>

<style scoped></style>
